﻿<%@ Page Title="" Language="C#" MasterPageFile="~/UI/Main/Main.Master" AutoEventWireup="true"
    CodeBehind="view_album.aspx.cs" Inherits="OrganizedIN.UI.video.view_album" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    <link href="../../src/css/facebox.css" rel="stylesheet" type="text/css" />
    <div id="middle_tab">
        <div id="middle_tab_title" align="center">
            My Videos</div>
        <div class="middle_tab_content">
            <br />
            <h4>
                You can Add, Search, Add Rating, Add To Album, Re-Name, Re-Date (Add to a future
                Date), Delete, Archive, and Share with your Group by clicking on the below icons:</h4>
            <br />
        </div>
        <div id="icon_link_wrapper" align="center">
            <div id="icon_primary_documents" align="center">
                <a href="M_add_new_videos.aspx" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Add New','','../../images/add_02.jpg',1)">
                    <img src="../../images/add_01.jpg" alt="Add New" name="Add New" width="75" height="75"
                        border="0" id="Add New" /></a></div>
            <div id="icon_secondary" align="center">
                <a href="M_search_my_videos.aspx" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Search','','../../images/search_02.jpg',1)">
                    <img src="../../images/search_01.jpg" alt="Search" name="Search" width="75" height="75"
                        border="0" id="Search" /></a></div>
            <div id="icon_secondary" align="center">
                <a href="add_rating_videos.aspx" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Add Rating','','../../images/add_rating_02.jpg',1)">
                    <img src="../../images/add_rating_01.jpg" alt="Add Rating" name="Add Rating" width="75"
                        height="75" border="0" id="Add Rating" /></a></div>
            <div id="icon_secondary" align="center">
                <a href="add_to_videoalbum.aspx" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Add to Album','','../../images/add_to_videoalbum_02.jpg',1)">
                    <img src="../../images/add_to_videoalbum_01.jpg" alt="Add to Album" name="Add to Album"
                        width="75" height="75" border="0" id="add_to_album" /></a></div>
            <div id="icon_secondary" align="center">
                <a href="rename_videos.aspx" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Re-Name','','../../images/rename_02.jpg',1)">
                    <img src="../../images/rename_01.jpg" alt="Re-Name" name="Add Re-Name" width="75"
                        height="75" border="0" id="Re-Name" /></a></div>
            <div id="icon_secondary" align="center">
                <a href="redate_videos.aspx" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Re-Date','','../../images/redate_02.jpg',1)">
                    <img src="../../images/redate_01.jpg" alt="Re-Date" name="Re-Date" width="75" height="75"
                        border="0" id="Re-Date" /></a></div>
            <div id="icon_secondary" align="center">
                <a href="share_with_group_videos.aspx" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Share with group','','../../images/share_02.jpg',1)">
                    <img src="../../images/share_01.jpg" alt="Share with group" name="Share with group"
                        width="75" height="75" border="0" id="Share with group" /></a></div>
            <div id="icon_secondary" align="center">
                <a href="delete_videos.aspx" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Delete','','../../images/delete_02.jpg',1)">
                    <img src="../../images/delete_01.jpg" alt="Delete" name="Delete" width="75" height="75"
                        border="0" id="Delete" /></a></div>
            <div id="icon_secondary" align="center">
                <a href="archive_videos.aspx" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Archive','','../../images/archive_02.jpg',1)">
                    <img src="../../images/archive_01.jpg" alt="Archive" name="Archive" width="75" height="75"
                        border="0" id="Archive" /></a></div>
        </div>
        <div class="documents_table">

            <script src="../../src/js/jquery-1.4.2.min.js" type="text/javascript"></script>

            <script src="../../src/js/facebox.js" type="text/javascript"></script>

            <script type="text/javascript">
                jQuery(document).ready(function() {
                    jQuery('a.facebox').facebox();
                    $('a.video_links').bind('click', function(e) {
                        $('div.video_player_div').slideUp();
                        $('div.video_player_div').empty();

                        var type = "U";
                        var link = $(this).attr('href').toString();
                        if (link.indexOf("www.youtube-nocookie.com") != -1) {
                            type = "Y";
                        }

                        if (type == "Y") {
                            var video_div = "video_player_" + $(this).attr('id');
                            var object_embed = "<object width='480' height='300'><param name='movie' value='" + link + "'></param><param name='allowFullScreen' value='true'></param><param name='allowscriptaccess' value='always'></param><embed src='" + link + "' type='application/x-shockwave-flash' allowscriptaccess='always' allowfullscreen='true' width='480' height='300'></embed></object>";
                            $('#' + video_div).slideDown();
                            $('#' + video_div).html(object_embed);
                        }
                        else {
                            var video_div = "video_player_" + $(this).attr('id');
                            var video_box_id = "vp_" + $(this).attr('id');
                            var video_box = "<a id='" + video_box_id + "' class='video_player' href='" + link + "'>VIDEO</a>";
                            $('#' + video_div).html(video_box);
                            $('#' + video_div).slideDown();
                            flowplayer("vp_" + $(this).attr('id'), "../../src/flowplayer/flowplayer-3.2.7.swf");
                            flowplayer("vp_" + $(this).attr('id'), "../../src/flowplayer/flowplayer-3.2.7.swf");
                        }
                        e.preventDefault();
                    })
                })
            </script>

            <style type="text/css">
                h4, p
                {
                    margin: 0;
                    padding: 0;
                }
                ul li
                {
                    margin-bottom: 20px;
                }
                #wrapper
                {
                    width: 100%;
                    padding: 20px;
                }
                #wrapper .left-pane
                {
                    display: block;
                    width: 200px;
                    height: 550px;
                    overflow: auto;
                    float: left;
                }
                #wrapper .left-pane ul
                {
                    list-style: none;
                }
                h4
                {
                    font-weight: bold;
                }
                div.video_player_div
                {
                    display: none;
                    height: 300px;
                    margin-top: 30px;
                    width: 700px;
                    clear: both;
                }
                a.video_player
                {
                    display: block;
                    width: 500px;
                    height: 280px;
                    background-color: #000;
                }
                .left-pane li
                {
                    list-style: none;
                }
            </style>
            <div id="wrapper">
                <div id="left_pane" class="left_pane" runat="server">
                </div>
                <h4 id="vs" runat="server">
                </h4>
            </div>
        </div>
</asp:Content>
